<template>
  <div class="todo-container">
    <h3>使用vuex共享数据</h3>
    <div class="todo-wrap">
      <TodoHeader/>
      <TodoList/>
      <TodoFooter/>
    </div>
  </div>
</template>

<script>
import TodoHeader from '../components/todo3/TodoHeader.vue'
import TodoList from '../components/todo3/TodoList.vue'
import TodoFooter from '../components/todo3/TodoFooter.vue'

export default {

  components: {
    TodoHeader,
    TodoList,
    TodoFooter
  }
}
</script>

<style>
  .todo-container {
    width: 600px;
    margin: 0 auto;
  }
  .todo-container .todo-wrap {
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
  }
</style>
